<template>
  <div class="user-system">
    <div class="form-area">
      <h2></h2>
      <input 
        placeholder="输入用户名"
      >
      <div class="tips"></div>
      <select  class="role-select">
        <option 
        >
        </option>
      </select>
      <div class="warning">
        <span ></span>
      </div>
      <button 
      >
        添加用户
      </button>
    </div>

    <div class="user-list">
      <div class="empty-tip">
        暂无用户，请添加新用户
      </div>
      <table>
        <thead>
          <tr>
            <th><input type="checkbox" ></th>
            <th>用户名</th>
            <th>角色</th>
            <th>状态</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <tr 
            style="text-align: center;"
          >
            <td><input type="checkbox" ></td>
            <td></td>  <!-- 文本插值 -->
            <td ></td> 
            <td>
              <button 
              >
              </button>
            </td>
            <td>
              <button 
              >
                删除
              </button>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>



